<template >
  <div>
    <div>
      <el-input v-model="title"></el-input>
    </div>
    <quill-editor
      ref="myQuillEditor"
      v-model="content"
      :options="editorOption"
      @blur="onEditorBlur($event)"
      @focus="onEditorFocus($event)"
    />
    <div>
    <el-button type='primary' @click='submit'>发布</el-button>
  </div>
  </div>
</template>

<script>
export default {
  data: function() {
    return {
      title:'',
      content: "",
      editorOption: ""
    };
  },
  methods: {
    onEditorBlur(quill) {
      console.log("editor blur!", quill);
    },
    onEditorFocus(quill) {
      console.log("editor focus!", quill);
    },
    submit(){
      var data= {
        title:this.title,
        content:this.content
      }
      this.$http.articleCreate(data).then(()=>{
        console.log('发布成功')
        this.title='',
        this.content=''
      })
    }
  }
};
</script>

<style lang="scss">
.ql-editor{
  height: 400px;
}

</style>